const webpack = require("webpack");
const path = require("path");
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;

module.exports = {
    entry: {
        "a": path.resolve(__dirname, 'src/js/a.js'),
        "b": path.resolve(__dirname, 'src/js/b.js'),
        "vendor": ['jquery', 'bootstrap'] //使用合并打包，会产生一个webpack打包构建依赖的文件，在引用的时候要引进去
    },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'js/[name].js'
    },
    module: {
        rules: [{
            test: /\.less$/,
            use: [{
                loader: "style-loader",
                options: {
                    singleton: true //多个style标签合为一个
                }
            }, {
                loader: "css-loader",
            }, {
                loader: "less-loader"
            }]
        }]
    },
    resolve: {
        alias: {
            jquery: path.resolve(__dirname, 'src/lib/jquery.js'),
            bootstrap: path.resolve(__dirname, 'src/lib/bootstrap.js'),
        }
    },
    plugins: [
        new webpack.ProvidePlugin({ //这样写是为了让全局可以查到jquery否则bootStrap会报错。
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery"
        }),
        new CommonsChunkPlugin({ //打包共用库
            names: ['vendor'],
            minChunks: Infinity
        }),
        new HtmlWebpackPlugin({
            template: path.resolve(__dirname, 'src/html/a.html'),
            filename: 'a.html',
            chunks: ['vendor', 'jquery', 'a'] //所以这里我们得引入两个文件vendor和jQuery
        }),
        new HtmlWebpackPlugin({
            template: path.resolve(__dirname, 'src/html/b.html'),
            filename: 'b.html',
            chunks: ['vendor', 'jquery', 'b']
        })
    ],
    devServer: {
        contentBase: path.join(__dirname, "dist"), //告诉服务器从哪里提供内容。只有在你想要提供静态文件时才需要
        port: "3000", //端口号
        open: true, //自动用浏览器打开网页，默认是true
        hot: true, //热更新
        openPage: 'a.html', //指定打开的页面
        allowedHosts: [ //配置一个白名单列表，只有HTTP请求的HOST在列表里才正常返回
            "localhost:80"
        ]
    },
}